<script src="../../ToDoList/vue.min.js"></script>
<template>
  <div class="contrainer">
    <!--<abc></abc>-->
    <appHeader @msgchange="msgchange"></appHeader>
    <todoList title="正在进行" :injectmsg.sync="doingInput" @output="doing" ></todoList>
    <todoList title="已经完成" :injectmsg.sync="doneInput" @output="done"></todoList>
  </div>
</template>

<script>
import abc from './components/abc';
import appHeader from './components/appHeader';
import todoList from './components/todoList';

export default {
  data() {
    return {
      temp: '',
      doneInput: '',
      doingInput: '',
    };
  },
  methods: {
    msgchange(data) {
      this.temp = data;
    },
    doing(data) {
      this.doneInput = data;
    },
    done(data) {
      this.doingInput = data;
    },
  },
  props: [],
  watch: {
    temp() {
      this.doingInput = this.temp;
    },
  },
  components: { abc, todoList, appHeader },
};
</script>


<style>
.contrainer{
  width: 100vw;
  height: 100vh;
}
</style>
